<template>
	<view class="u-page">
		<u-transition :show="true" mode="fade-up">
			<u-gap :height="vxbottom+20"></u-gap>
			<!-- <view v-show="img" class="img" ref="bgimg">
			</view> -->
			<u-tabs :activeStyle="{
						color: '#999ca2',
						fontWeight: 'bold',
						transform: 'scale(1.05)'
					}" :inactiveStyle="{
						color: '#686b6f',
						transform: 'scale(1)'
					}" :list="list1" @change="click"></u-tabs>
			<u-list @scrolltolower="scrolltolower">
				<u-list-item v-for="(item, index) in order" :key="index">
					<u-cell style="display: flex;">
						<view style="color: rgba(200,200,200,200);flex: 1;" slot="value" class="u-slot-value">
							{{item.shop.title}}
						</view>
						<u-avatar slot="icon" shape="square" size="35" :src="item.shop.bqimg"
							customStyle="margin: -3px 5px -3px 0"></u-avatar>
						<u-avatar slot="icon" shape="square" size="35" v-if="item.shop.type==1" src="/static/mt.png"
							customStyle="margin: -3px 5px -3px 0"></u-avatar>
						<u-avatar slot="icon" shape="square" size="35" v-if="item.shop.type==2" src="/static/elm.png"
							customStyle="margin: -3px 5px -3px 0"></u-avatar>
						<view style="color: rgba(200,200,200,200);" slot="value" class="u-slot-value">
							<template v-if="item.status==0 || item.status==3">
								<template v-if="item.endtimedistance==''||item.endtimedistance==undefined">
									<text>已经结束</text>
								</template>
								<template v-else>
									距离结束: <text v-text="item.endtimedistance"></text>
								</template>
							</template>
						</view>
						<view style="color: rgba(200,200,200,200);" slot="value" class="u-slot-value">
							<template v-if="item.status==4">
								已经放弃
							</template>
							<template v-else-if="item.status==1">
								进行中
							</template>
							<template v-else-if="item.status==0">
								<view style="flex: 1;">
									<xbutton style="display: inline-block" mini txt="放弃" @click="fq(item.id)"></xbutton>
									<xbutton style="display: inline-block;margin-left: 10rpx;" mini txt="上传订单"
										@click="scdd(item.id,item.shop.id,item.task.id)">
									</xbutton>
								</view>
							</template>
						</view>
					</u-cell>


				</u-list-item>
			</u-list>
			<u-modal :show="show" :content="content" @confirm="qr()">
			</u-modal>
		</u-transition>
		<widget name="buttom"></widget>
		<widget name="uporder" :data="{id:uporderid}" v-if="uporderid!=0"></widget>
	</view>
</template>

<script>
	import widget from "../service/widget"
	import xbutton from "../vue/xbutton.vue"
	export default {
		data() {
			return {
				showt: true,
				show: false,
				content: "放弃成功",
				userid: 0,
				orderlist: [],
				order: [],
				timeid: 0,
				select: 0,
				ordertimeend: 0,
				uporderid: 0,
				list1: [{
					name: '进行中'
				}, {
					name: '已完成'
				}, {
					name: '全部'
				}],
				vxbottom: 0
			}
		},
		methods: {
			qr() {
				this.show = false
			},
			getDatePoor(endDate, nowDate) {

				var date3 = Date.parse(endDate) - Date.parse(nowDate); //时间差的毫秒数        

				//计算出相差天数  
				var days = Math.floor(date3 / (24 * 3600 * 1000))

				//计算出小时数  

				var leave1 = date3 % (24 * 3600 * 1000) //计算天数后剩余的毫秒数  
				var hours = Math.floor(leave1 / (3600 * 1000))
				//计算相差分钟数  
				var leave2 = leave1 % (3600 * 1000) //计算小时数后剩余的毫秒数  
				var minutes = Math.floor(leave2 / (60 * 1000))
				//计算相差秒数  
				var leave3 = leave2 % (60 * 1000) //计算分钟数后剩余的毫秒数  
				var seconds = Math.round(leave3 / 1000)
				return (days <= 0 ? "" : days + "天") + (hours <= 0 ? "" : hours + "小时") + (minutes <= 0 ? "" :
					minutes + "分钟") + (seconds <= 0 ? "" : seconds + "秒")
			},
			timex(date, type, number) {
				var timestamp1 = Date.parse(new Date(date));
				if (isNaN(timestamp1)) { //兼容IE,safari...
					date = date.replace(/-/ig, "/");
					timestamp1 = Date.parse(new Date(date));
				}
				var timestamp2;
				switch (type) {
					case "h":
						timestamp2 = timestamp1 + number * 60000 * 60;
						break;
					case "m":
						timestamp2 = timestamp1 + number * 60000;
						break;
					case "s":
						timestamp2 = timestamp1 + number * 1000;
						break;
					case "mi":
						timestamp2 = timestamp1 + number;
						break;
				}
				var date = new Date(timestamp2);
				var Y = date.getFullYear() + '-';
				var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
				var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';
				var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
				var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
				var s = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds();
				return Y + M + D + h + m + s;
			},
			fq(index) {
				var that = this
				this.$http.postf('order/fail?id=' + index).then(res => {
					let x = JSON.parse(res.data)
					if (x.meta.code == 200) {
						that.content = "放弃成功！"
						that.show = true
					} else if (x.meta.code == 400) {
						that.content = "放弃失败！"
						that.show = true
					}

					that.updateorder()
				})
			},
			scdd(id) {
				this.uporderid = id
				this.showt = true
				// uni.navigateTo({
				// 	url: '/pages/widget/table?id=' + id,
				// });
			},
			click(index) {
				this.select = index.index
				if (index.index == 0) {
					this.order = []
					this.order = this.orderlist.filter(item => item.status == 0 || item.status == 1 || item.status == 3)
				} else if (index.index == 1) {
					this.order = []
					this.order = this.orderlist.filter(item => item.status == 2)
				} else if (index.index == 2) {
					this.order = []
					this.order = this.orderlist
				}
			},
			scrolltolower() {
				this.loadmore()
			},
			loadmore() {
				for (let i = 0; i < 30; i++) {
					// this.indexList.push({
					// 	url: this.urls[uni.$u.random(0, this.urls.length - 1)]
					// })
				}
			},
			loadtime() {
				var that = this
				for (var j = 0; j < that.orderlist.length; j++) {
					that.orderlist[j].endtimedistance = that.getDatePoor(that.timex(that.orderlist[j].createTime, "h",
						that.ordertimeend), new Date())
				}
				this.$forceUpdate()
			},
			updateorder() {
				this.$http.postf('order/page', {
					current: 1,
					size: 10
				}).then(res => {
					if (res.statusCode == 200) {
						let x = JSON.parse(res.data).data
						this.current = x.current
						this.total = x.total
						this.size = x.size
						this.pages = x.pages
						this.orderlist = x.records
						this.loadtime()
						this.order = []
						this.order = this.orderlist.filter(item => item.status == 0 || item.status == 1 || item
							.status == 3)
						this.$forceUpdate()
					}
				})
			}
		},
		onShow() {
			var that = this
			this.$http.postf('setting/find?id=1').then(res => {
				if (res.statusCode == 200) {
					let x = JSON.parse(res.data).data
					that.ordertimeend = x.value
				}
			})
			this.userid = uni.getStorageSync('userid');

			this.updateorder()
		},
		beforeDestroy() {
			clearInterval(this.timeid)
		},
		created() {
			var that = this
			that.timeid = setInterval(() => {
				that.loadtime()
			}, 1000);
			// #ifdef MP-WEIXIN
			let menuButtonInfo = uni.getMenuButtonBoundingClientRect()
			this.vxbottom = menuButtonInfo.bottom
			// #endif
		},
		components: {
			widget,
			xbutton
		}
	}
</script>

<style>

</style>
